[id].vue 49 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190
  1. <template>
  2. <div>
  3. <HomePageHead></HomePageHead>
  4. <HomePageNavigation></HomePageNavigation>
  5. <HomeAdvertising :imgurl="adImg1" v-if="adImg1"></HomeAdvertising>
  6. <!-- 面包屑导航 -->
  7. <div class="breadcrumb phone_none">
  8. <div class="inner">
  9. <span class="location">当前位置:</span>
  10. <el-breadcrumb :separator-icon="ArrowRight">
  11. <el-breadcrumb-item>
  12. <NuxtLink to="/">首页</NuxtLink>
  13. </el-breadcrumb-item>
  14. <el-breadcrumb-item>
  15. <NuxtLink :to="`/${parent_pinyin}/index.html`"> {{ parent_name }}</NuxtLink>
  16. </el-breadcrumb-item>
  17. <el-breadcrumb-item>招聘详情</el-breadcrumb-item>
  18. </el-breadcrumb>
  19. </div>
  20. </div>
  21. <div class="breadcrumb_box pc_none">
  22. <span class=" ">当前位置:</span>
  23. <NuxtLink to="/">首页</NuxtLink>
  24. <span class=" ">&gt;</span>
  25. <NuxtLink :to="`/${parent_pinyin}/index.html`"> {{ parent_name }}</NuxtLink>
  26. <span class=" ">&gt;</span>
  27. <span class=" ">招聘详情 </span>
  28. </div>
  29. <!-- 简历 -->
  30. <!-- <main class="gerenjianli" v-if="type == 2">
  31. <section class="index_1 clearfix">
  32. <div class="seek_head_box clearfix">
  33. <div class="seek_head_left">
  34. <a class="seek_head_a seek_head_only" title="">个人简历</a>
  35. </div>
  36. <div class="seek_head_right_box clearfix">
  37. <span class="seek_head_right_text">更新时间:{{ jobInfo.created_at }}</span>
  38. </div>
  39. </div>
  40. <div class="index_1_left clearfix">
  41. <div class="seek_introduce_box clearfix">
  42. <div class="seek_introduce_left clearfix">
  43. <div class="seek_introduce_head clearfix">
  44. <h4 class="seek_introduce_h4">{{ jobInfo.name }}</h4>
  45. <div class="seek_introduce_tag clearfix" v-if="resume">此简历已被推荐</div>
  46. <div class="seek_introduce_text clearfix" v-if="resume">
  47. (已有单位把本简历加入人才库)
  48. </div>
  49. </div>
  50. <div class="seek_introduce_title_box clearfix">
  51. <span class="seek_introduce_label">期望岗位:</span>
  52. <span class="seek_introduce_title">{{ jobInfo.jtzw_name }}</span>
  53. <span class="seek_introduce_label">薪资待遇:</span>
  54. <span class="seek_introduce_title">{{ jobInfo.salary_name }}</span>
  55. </div>
  56. </div>
  57. </div>
  58. <div class="seek_introduce_foot clearfix">
  59. <span class="seek_introduce_foot_text" v-if="jobInfo.sexy">
  60. {{ jobInfo.sexy == 1 ? '男' : '女' }}
  61. </span>
  62. <span class="seek_introduce_foot_text" v-if="jobInfo.birth">
  63. {{ getTime(jobInfo.birth, 'year', 0) }}
  64. </span>
  65. <span class="seek_introduce_foot_text" v-if="jobInfo.origin">
  66. 籍贯:{{ jobInfo.origin }}
  67. </span>
  68. <span class="seek_introduce_foot_text" v-if="jobInfo.education_name">
  69. {{ jobInfo.education_name }}
  70. </span>
  71. <span class="seek_introduce_foot_text" v-if="jobInfo.experience_name">
  72. {{ jobInfo.experience_name }}
  73. </span>
  74. <span class="seek_introduce_foot_text" v-if="jobInfo.hunt_cityname">
  75. 工作地点:{{ jobInfo.hunt_cityname }}
  76. </span>
  77. <span class="seek_introduce_foot_text" v-if="jobInfo.language_name">
  78. {{ jobInfo.language_name }}
  79. </span>
  80. </div>
  81. </div>
  82. <div class="index_1_right clearfix">
  83. <img class="index_1_right_img" src="@/public/image/touxiang.png" title="" alt=""
  84. v-if="!jobInfo.imgurl">
  85. <img class="index_1_right_img" :src="jobInfo.imgurl" title="" alt="" v-if="jobInfo.imgurl">
  86. </div>
  87. </section>
  88. </main> -->
  89. <!-- <main class="jianli" v-if="type == 2">
  90. <section class="index_2 clearfix">
  91. <div class="seek_head_box clearfix">
  92. <div class="seek_head_left">
  93. <a class="seek_head_a seek_head_only" title="">自我介绍</a>
  94. </div>
  95. </div>
  96. <article class="seek_article">
  97. {{ jobInfo.self_evaluation }}
  98. </article>
  99. </section>
  100. <section class="index_3 clearfix">
  101. <div class="seek_head_box clearfix">
  102. <div class="seek_head_left">
  103. <a class="seek_head_a seek_head_only" title="">工作经历</a>
  104. </div>
  105. </div>
  106. <div class="seek_in clearfix" v-for="(item, index) in experienceInfo" :key="index">
  107. <div class="seek_in_head clearfix">
  108. <span class="seek_in_head_text">{{ index + 1 }}.{{ item.company_name }}</span>
  109. <span class="seek_in_head_text">
  110. 职位类别:
  111. {{ item.zw_name }}
  112. </span>
  113. <span class="seek_in_head_text">
  114. 具体职位:
  115. {{ item.jtzw_name }}
  116. </span>
  117. <span class="seek_in_head_text" style="float: right;" v-if="item.job_timeList">
  118. {{ getTime(item.job_timeList[0], 'year', 0) }}
  119. -
  120. {{ getTime(item.job_timeList[1], 'year', 0) }}
  121. </span>
  122. </div>
  123. <div class="seek_in_ul clearfix">
  124. <div class="seek_in_li clearfix">
  125. <label class="seek_in_label">工作内容:</label>
  126. <div class="seek_in_li_text">{{ item.job_content }}</div>
  127. </div>
  128. <div class="seek_in_li clearfix">
  129. <label class="seek_in_label">工作业绩:</label>
  130. <div class="seek_in_li_text">{{ item.performance }}</div>
  131. </div>
  132. </div>
  133. </div>
  134. </section>
  135. <section class="index_4 clearfix">
  136. <div class="seek_head_box clearfix">
  137. <div class="seek_head_left">
  138. <a class="seek_head_a seek_head_only" title="">教育背景</a>
  139. </div>
  140. </div>
  141. <div class="seek_in clearfix" v-for="(item, index) in education" :key="index">
  142. <div class="seek_in_head clearfix">
  143. <span class="seek_in_head_text"
  144. v-if="item.school_name || item.education_name || item.school_major || item.school_timeList">
  145. {{ index + 1 }}. {{ item.school_name }} {{ education }}
  146. </span>
  147. <span class="seek_in_head_text">
  148. {{ item.education_name }}
  149. </span>
  150. <span class="seek_in_head_text">{{ item.school_major }}</span>
  151. <span class="seek_in_head_text" style="float: right;" v-if="item.school_timeList">
  152. {{ getTime(item.school_timeList[0], 'year', 0) }}
  153. -
  154. {{ getTime(item.school_timeList[1], 'year', 0) }}
  155. </span>
  156. </div>
  157. <div class="seek_in_ul clearfix" v-if="item.school_experience">
  158. <div class="seek_in_li clearfix">
  159. <label class="seek_in_label">在校经历:</label>
  160. <div class="seek_in_li_text">{{ item.school_experience }}</div>
  161. </div>
  162. </div>
  163. </div>
  164. </section>
  165. <section class="index_5 clearfix">
  166. <div class="seek_head_box clearfix">
  167. <div class="seek_head_left">
  168. <a class="seek_head_a seek_head_only" title="">专业技能</a>
  169. </div>
  170. </div>
  171. <div class="seek_in clearfix">
  172. <div class="seek_in_ul clearfix">
  173. <div class="seek_in_li clearfix" v-for="(item, index) in skillList">
  174. <label class="seek_in_label" v-if="item.skill">{{ index + 1 }}.</label>
  175. <div class="seek_in_li_text">{{ item.skill }}</div>
  176. </div>
  177. </div>
  178. </div>
  179. </section>
  180. <section class="index_6 clearfix">
  181. <div class="seek_head_box clearfix">
  182. <div class="seek_head_left">
  183. <a class="seek_head_a seek_head_only" title="">联系方式</a>
  184. </div>
  185. </div>
  186. <div class="seek_in clearfix" v-if="type_id == 10000 || type_id == 3">
  187. <article class="seek_article_2">
  188. {{ jobInfo.phone }}
  189. </article>
  190. </div>
  191. <div class="seek_in clearfix" v-else>
  192. <article class="seek_article_2">
  193. 登录后可查看
  194. </article>
  195. </div>
  196. </section>
  197. </main> -->
  198. <!-- 岗位 -->
  199. <div class="gangwei" v-if="type == 1">
  200. <main class="color_main">
  201. <main class="index_main">
  202. <section class="index_1 clearfix">
  203. <div class="cruit_head_box clearfix phone_none">
  204. <div class="cruit_head_left">
  205. <a class="cruit_head_a cruit_head_only" title="">基本信息</a>
  206. </div>
  207. </div>
  208. <div class="phone_box_1 pc_none">
  209. <div class="phone_box_1_head">
  210. <a title="">基本信息</a>
  211. </div>
  212. </div>
  213. <div class="index_1_box clearfix">
  214. <div class="demand_head_box clearfix">
  215. <div class="demand_head_name">{{ jobInfo.title }}</div>
  216. <div class="demand_head_btn hand phone_none" v-if="type_id == 1" @click="applyJob">申请该职位</div>
  217. <div class="demand_head_btn1 phone_none" v-if="type_id != 1">申请该职位</div>
  218. <div class="phone_head_btn_box pc_none">
  219. <div class="phone_head_btn phone_head_btn_green" v-if="type_id == 1" @click="applyJob">
  220. 申请该职位
  221. </div>
  222. <div class="phone_head_btn phone_head_btn_gray" v-if="type_id != 1"> 申请该职位 </div>
  223. </div>
  224. </div>
  225. <div class="cruit_li_2_foot clearfix">
  226. <span class="cruit_li_2_foot_tag cruit_li_2_foot_exper">
  227. {{ jobInfo.hy_name }}
  228. &gt;
  229. {{ jobInfo.zw_name }}
  230. </span>
  231. <span class="cruit_li_2_foot_tag cruit_li_2_foot_addres">{{ jobInfo.city_name }}</span>
  232. </div>
  233. </div>
  234. </section>
  235. </main>
  236. </main>
  237. <main class="index_main">
  238. <section class="index_2 clearfix">
  239. <div class="demand_1 clearfix">
  240. <div class="demand_left_1 clearfix">
  241. <div class="cruit_head_box clearfix phone_none">
  242. <div class="cruit_head_left">
  243. <a class="cruit_head_a cruit_head_only" title="">基本要求</a>
  244. </div>
  245. </div>
  246. <div class="phone_box_2 pc_none">
  247. <div class="phone_box_1_head">
  248. <a title="">基本要求</a>
  249. </div>
  250. </div>
  251. <div class="demand_ul_2">
  252. <div class="demand_li_2 clearfix">
  253. <div class="demand_li_2_label">工作性质:</div>
  254. <div class="demand_li_2_text clearfix">{{ jobInfo.job_nature_name }}</div>
  255. </div>
  256. <div class="demand_li_2 clearfix">
  257. <div class="demand_li_2_label">工作经验:</div>
  258. <div class="demand_li_2_text clearfix">{{ jobInfo.experience_name }}</div>
  259. </div>
  260. <div class="demand_li_2 clearfix">
  261. <div class="demand_li_2_label">学历文凭:</div>
  262. <div class="demand_li_2_text clearfix">{{ jobInfo.education_name }}</div>
  263. </div>
  264. <div class="demand_li_2 clearfix">
  265. <div class="demand_li_2_label">语言选择:</div>
  266. <div class="demand_li_2_text clearfix">{{ jobInfo.language_name }}</div>
  267. </div>
  268. <div class="demand_li_2 clearfix">
  269. <div class="demand_li_2_label">薪资待遇:</div>
  270. <div class="demand_li_2_text clearfix">{{ jobInfo.salary_name }}</div>
  271. </div>
  272. <div class="demand_li_2 clearfix">
  273. <div class="demand_li_2_label">截止日期:</div>
  274. <div class="demand_li_2_text clearfix">
  275. {{ getTime(jobInfo.created_at, 'year', 1) }}
  276. </div>
  277. </div>
  278. </div>
  279. </div>
  280. <div class="demand_left_2 clearfix">
  281. <div class="cruit_head_box clearfix phone_none">
  282. <div class="cruit_head_left">
  283. <a class="cruit_head_a cruit_head_only" title="">岗位职责</a>
  284. </div>
  285. </div>
  286. <div class="phone_box_3 pc_none">
  287. <div class="phone_box_1_head">
  288. <a title="">岗位职责</a>
  289. </div>
  290. </div>
  291. <article class="demand_article_1">
  292. {{ jobInfo.description }}
  293. </article>
  294. </div>
  295. <div class="demand_left_3 clearfix ">
  296. <div class="cruit_head_box clearfix phone_none">
  297. <div class="cruit_head_left">
  298. <a class="cruit_head_a cruit_head_only" title="">具体要求</a>
  299. </div>
  300. </div>
  301. <div class="phone_box_4 pc_none">
  302. <div class="phone_box_1_head">
  303. <a title="">具体要求</a>
  304. </div>
  305. </div>
  306. <article class="demand_article_1">
  307. {{ jobInfo.jt_description }}
  308. </article>
  309. </div>
  310. <div class="demand_left_4 clearfix">
  311. <div class="cruit_head_box clearfix phone_none">
  312. <div class="cruit_head_left">
  313. <a class="cruit_head_a cruit_head_only" title="">联系方式</a>
  314. </div>
  315. </div>
  316. <div class="phone_box_5 pc_none">
  317. <div class="phone_box_1_head">
  318. <a title="">公司信息</a>
  319. </div>
  320. </div>
  321. <div class="demand_ul_2">
  322. <div class="demand_li_2 clearfix">
  323. <div class="demand_li_2_label">地址:</div>
  324. <div class="demand_li_2_text clearfix">{{ companyInfo.address_name }}</div>
  325. </div>
  326. <div class="demand_li_2 clearfix">
  327. <div class="demand_li_2_label">邮箱:</div>
  328. <div class="demand_li_2_text clearfix">{{ companyInfo.email }}</div>
  329. </div>
  330. <div class="demand_li_2 clearfix pc_none">
  331. <div class="demand_li_2_label">公司规模:</div>
  332. <div class="demand_li_2_text clearfix">{{ companyInfo.company_size_name }}</div>
  333. </div>
  334. <div class="demand_li_2 clearfix pc_none">
  335. <div class="demand_li_2_label">公司性质:</div>
  336. <div class="demand_li_2_text clearfix">{{ companyInfo.company_nature_name }}</div>
  337. </div>
  338. <div class="demand_li_2 clearfix pc_none">
  339. <div class="demand_li_2_label">公司行业:</div>
  340. <div class="demand_li_2_text clearfix">{{ companyInfo.hy_name }}</div>
  341. </div>
  342. </div>
  343. </div>
  344. <div class="demand_left_5 clearfix phone_none">
  345. <div class="cruit_head_box clearfix phone_none">
  346. <div class="cruit_head_left">
  347. <a class="cruit_head_a cruit_head_only" title="">公司介绍</a>
  348. </div>
  349. </div>
  350. <div class="demand_ul_2">
  351. <div class="demand_li_2 clearfix">
  352. <div class="demand_li_2_label">公司规模:</div>
  353. <div class="demand_li_2_text clearfix">{{ companyInfo.company_size_name }}</div>
  354. </div>
  355. <div class="demand_li_2 clearfix">
  356. <div class="demand_li_2_label">公司性质:</div>
  357. <div class="demand_li_2_text clearfix">{{ companyInfo.company_nature_name }}</div>
  358. </div>
  359. <div class="demand_li_2 clearfix">
  360. <div class="demand_li_2_label">公司行业:</div>
  361. <div class="demand_li_2_text clearfix">{{ companyInfo.hy_name }}</div>
  362. </div>
  363. </div>
  364. </div>
  365. <div class="demand_left_6 clearfix pc_none">
  366. <div class="phone_box_6 pc_none">
  367. <div class="phone_box_1_head">
  368. <a title="">联系方式</a>
  369. </div>
  370. </div>
  371. <div class="demand_ul_2">
  372. <div class="demand_li_2 clearfix">
  373. <div class="demand_li_2_label">地址:</div>
  374. <div class="demand_li_2_text clearfix">{{ companyInfo.address_name }}</div>
  375. </div>
  376. <div class="demand_li_2 clearfix">
  377. <div class="demand_li_2_label">邮箱:</div>
  378. <div class="demand_li_2_text clearfix">{{ companyInfo.email }}</div>
  379. </div>
  380. </div>
  381. </div>
  382. <div class="demand_left_7 clearfix pc_none">
  383. <div class="phone_box_7 pc_none">
  384. <div class="phone_box_1_head">
  385. <a title="">招聘单位</a>
  386. </div>
  387. </div>
  388. <div class="demand_ul_1">
  389. <span class="demand_ul_1_span dot1">
  390. {{ companyInfo.business_name }}
  391. </span>
  392. </div>
  393. </div>
  394. <div class="demand_left_8 clearfix pc_none">
  395. <div class="phone_box_8 pc_none">
  396. <div class="phone_box_1_head">
  397. <a title="">其他职位</a>
  398. </div>
  399. </div>
  400. <div class="demand_ul_1">
  401. <NuxtLink class="phone_ul_a dot1" :href="`/${item.pinyin}/${item.id}.html`" title=""
  402. v-for="(item, index) in other_job" :key="item.id">
  403. {{ item.title }}
  404. </NuxtLink>
  405. </div>
  406. </div>
  407. </div>
  408. <div class="demand_2 clearfix phone_none">
  409. <div class="demand_right_1 clearfix">
  410. <div class="cruit_head_box clearfix phone_none">
  411. <div class="cruit_head_left">
  412. <a class="cruit_head_a cruit_head_only" title="">招聘单位</a>
  413. </div>
  414. </div>
  415. <div class="phone_box_1 pc_none">
  416. <div class="phone_box_1_head">
  417. <a title="">招聘单位</a>
  418. </div>
  419. </div>
  420. <div class="demand_ul_1">
  421. <span class="demand_ul_1_span dot1">
  422. {{ companyInfo.business_name }}
  423. </span>
  424. </div>
  425. </div>
  426. <div class="demand_right_2 clearfix">
  427. <div class="cruit_head_box clearfix phone_none">
  428. <div class="cruit_head_left">
  429. <a class="cruit_head_a cruit_head_only" title="">其他职位</a>
  430. </div>
  431. </div>
  432. <div class="phone_box_8 pc_none">
  433. <div class="phone_box_1_head">
  434. <a title="">其他职位</a>
  435. </div>
  436. </div>
  437. <div class="demand_ul_1">
  438. <NuxtLink class="demand_ul_1_a dot1" :href="`/${item.pinyin}/${item.id}.html`" title=""
  439. v-for="(item, index) in other_job" :key="item.id">
  440. {{ item.title }}
  441. </NuxtLink>
  442. </div>
  443. </div>
  444. </div>
  445. </section>
  446. </main>
  447. </div>
  448. <HomeAdvertising :imgurl="adImg2" v-if="adImg2"></HomeAdvertising>
  449. <HomeFoot1></HomeFoot1>
  450. <div class="phone_foot pc_none"></div>
  451. </div>
  452. </template>
  453. <script setup>
  454. import { ref, reactive } from 'vue'
  455. import { ElBreadcrumb, ElBreadcrumbItem, ElMessage } from 'element-plus'
  456. import { ArrowRight } from '@element-plus/icons-vue'
  457. const route = useRoute();
  458. const type = ref(1);
  459. const nuxtApp = useNuxtApp();
  460. const axios = nuxtApp.$axios;
  461. //获取用户信息
  462. let type_id = ref('')
  463. let website_id = ref('')
  464. let getUserInfo = () => {
  465. axios.get("/user/getUserInfo").then(response => {
  466. console.log("gettypeid", response.data);
  467. type_id.value = response.data.type_id
  468. website_id.value = response.data.website_id
  469. })
  470. }
  471. onMounted(() => {
  472. getUserInfo()
  473. })
  474. //1.1 获得跳转过来的id
  475. const articleId = parseInt(route.params.id); //获得该页面的id
  476. // const existingArr = [];
  477. const articleIdArr = reactive([articleId]);
  478. // let articleIdArr = Array.of(articleId);
  479. // console.log('111222111', articleId);
  480. //1.2 获得父级栏目的名称、id
  481. //获得当前的完整路径
  482. const fullPath = route.path;
  483. //拆分,取出来中间这一段,然后提取数字部分
  484. const segments = fullPath.split('/');
  485. const targetSegment = segments[1];
  486. const targetRoute = segments[2];
  487. console.log("targetSegment1", targetSegment);
  488. console.log("targetSegment2", targetRoute);
  489. let routeId;
  490. //通过导航路径反向查询导航id
  491. const getRouteId = await requestDataPromise('/web/getWebsiteRoute', {
  492. method: 'GET',
  493. query: {
  494. 'pinyin': targetSegment,
  495. },
  496. });
  497. if (getRouteId.code == 200) {
  498. routeId = getRouteId.data.category_id
  499. } else {
  500. // console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
  501. // console.log("错误位置:通过url路径查询导航池id")
  502. // console.log("后端错误反馈:", getRouteId.message)
  503. // console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
  504. }
  505. //1.3 面包屑导航
  506. const parent_name = ref("");
  507. const parent_id = ref("");
  508. const parent_pinyin = ref("");
  509. let getParentNav = async () => {
  510. const listData = await requestDataPromise('/web/getOneWebsiteCategory', {
  511. method: 'GET',
  512. query: {
  513. 'catid': routeId
  514. },
  515. });
  516. if (listData.code == 200) {
  517. parent_name.value = listData.data.alias;
  518. parent_id.value = listData.data.parent_id;
  519. parent_pinyin.value = listData.data.aLIas_pinyin;
  520. } else {
  521. // console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
  522. // console.log("错误位置:获取面包屑导航")
  523. // console.log("后端错误反馈:", listData.message)
  524. // console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
  525. }
  526. }
  527. //获得父级栏目详情
  528. getParentNav();
  529. //1.4 展示广告
  530. let adImg1 = ref({})
  531. let adImg2 = ref({})
  532. onMounted(async () => {
  533. //从客户端获取行政职能部门 加快打开速度
  534. const { $webUrl, $CwebUrl } = useNuxtApp();
  535. //广告1
  536. let url = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=nmgw_detail_0001`
  537. const responseAd1 = await fetch(url, {
  538. headers: {
  539. 'Content-Type': 'application/json',
  540. 'Userurl': $CwebUrl,
  541. 'Origin': $CwebUrl
  542. }
  543. });
  544. const resultAd1 = await responseAd1.json();
  545. adImg1.value = resultAd1.data[0];
  546. //广告2
  547. let url2 = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=nmgw_detail_0002`
  548. const responseAd2 = await fetch(url2, {
  549. headers: {
  550. 'Content-Type': 'application/json',
  551. 'Userurl': $CwebUrl,
  552. 'Origin': $CwebUrl
  553. }
  554. });
  555. const resultAd2 = await responseAd2.json();
  556. adImg2.value = resultAd2.data[0];
  557. })
  558. // 2 获取详情
  559. let jobInfo = ref([]) //基本信息
  560. let companyInfo = ref([])// 公司介绍
  561. let category = ref([]) // 栏目
  562. let other_job = ref([]) // 岗位
  563. let experienceInfo = ref([]) // 工作经历
  564. let education = ref([]) // 教育背景
  565. let skillList = ref([]) // 专业技能
  566. let resume = ref(0)
  567. const getDetail = async () => {
  568. const listData = await requestDataPromise('/web/getWebsiteJobInfo', {
  569. method: 'GET',
  570. query: {
  571. 'id': articleId,
  572. 'type': type.value,
  573. 'pageSize': 10,
  574. },
  575. });
  576. if (listData.code == 200) {
  577. console.log("详情1111", listData.data);
  578. // console.log("详情1111222", listData.data.job[0].job_experience);
  579. // console.log("详情111122233", JSON.parse(listData.data.job[0].job_experience));
  580. // console.log("详情1111222233344", JSON.parse(listData.data.job[0].education_experience));
  581. // jobInfo.value = listData.data.job[0];
  582. // category.value = listData.data.category;
  583. if (type.value == 1) {
  584. jobInfo.value = listData.data.job[0];
  585. category.value = listData.data.category;
  586. companyInfo.value = listData.data.company[0];
  587. other_job.value = listData.data.other_job;
  588. }
  589. if (type.value == 2) {
  590. jobInfo.value = listData.data.job[0];
  591. category.value = listData.data.category;
  592. experienceInfo.value = listData.data.job_experience;
  593. education.value = listData.data.education_experience;
  594. skillList.value = JSON.parse(listData.data.job[0].skillList);
  595. resume.value = listData.data.resume;
  596. }
  597. }
  598. }
  599. getDetail();
  600. //获取行业 职位 具体职位
  601. const industry_categoryList = ref([]) //行业类别列表
  602. const position_categoryList = ref([]) //职位类别列表
  603. const positionList = ref([]) //具体职位列表
  604. const getData = async () => {
  605. const getData = await requestDataPromise('/web/getWebsiteJobSelect', {
  606. method: 'GET',
  607. query: {},
  608. });
  609. if (getData.code == 200) {
  610. // console.log("获取到的分类数据:", getData.data);
  611. industry_categoryList.value = getData.data.hy; //行业
  612. position_categoryList.value = getData.data.zw; //职位
  613. positionList.value = getData.data.jtzw; //具体职位
  614. }
  615. }
  616. getData()
  617. // 3 申请该职位
  618. const applyJob = () => {
  619. // console.log("点击了申请该职位", typeof website_id.value);
  620. // console.log("点击了申请该职位", articleIdArr);
  621. axios.post('/web/getWebsiteJobApply', {
  622. website_id: website_id.value,
  623. recruit_id: articleIdArr,
  624. }).then(response => {
  625. // console.log("申请该职位11111111", response);
  626. if (response.code == 200) {
  627. ElMessage({
  628. message: '申请成功',
  629. type: 'success',
  630. });
  631. } else {
  632. ElMessage({
  633. message: response.message,
  634. type: 'error',
  635. });
  636. }
  637. }).catch(error => {
  638. console.error('Error:', error);
  639. });
  640. }
  641. //4.设置seo信息 start---------------------------------------->
  642. //4.1 设置seo信息
  643. let seoTitle;
  644. let seoDescription;
  645. let seoKeywords;
  646. const listData = await requestDataPromise('/web/getWebsiteJobInfo', {
  647. method: 'GET',
  648. query: {
  649. 'id': articleId,
  650. 'type': type.value,
  651. 'pageSize': 10,
  652. },
  653. });
  654. if (listData.code == 200) {
  655. // console.log("详情1111", listData.data);
  656. seoTitle = listData.data.job[0].title;
  657. seoDescription = listData.data.job[0].seo_description;
  658. seoKeywords = listData.data.job[0].keyword;
  659. }
  660. const setData = await requestDataPromise('/web/getWebsiteCategoryHead', {
  661. method: 'GET',
  662. query: {
  663. 'catid': routeId,
  664. },
  665. });
  666. if (setData.code == 200) {
  667. let seoSuffix = setData.data.suffix;
  668. let seoName = setData.data.website_name;
  669. useSeoMeta({
  670. title: seoTitle + "_" + seoName + "_" + seoSuffix,
  671. meta: [
  672. { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix, tagPriority: 10 },
  673. { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix, tagPriority: 10 },
  674. { name: 'viewport', content: 'width=device-width,initial-scale=1,user-scalable=no',tagPriority: 10 }
  675. ]
  676. });
  677. } else {
  678. // console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
  679. // console.log("错误位置:设置列表页面SEO数据")
  680. // console.log("后端错误反馈:", setData.message)
  681. // console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
  682. }
  683. //4.设置seo信息 end---------------------------------------->
  684. </script>
  685. <style scoped lang="less">
  686. @import "@/assets/css/zgzpjianli.less";
  687. @import "@/assets/css/zgzpzhaopin.less";
  688. </style>
  689. <style lang="less" scoped>
  690. @media screen and (min-width:801px){/*pc*/
  691. .pc_none{display:none;}
  692. }
  693. @media screen and (max-width:800px){/*ipad_phone*/
  694. .breadcrumb_box {
  695. height: 22px;
  696. width: 92%;
  697. margin: 10px auto;
  698. word-break: keep-all;
  699. white-space: nowrap;
  700. overflow: hidden;
  701. text-overflow: ellipsis;
  702. width: 92%;
  703. font-size: 14px;
  704. color: #666;
  705. * {
  706. font-size: 14px;
  707. display: inline;
  708. color: #666;
  709. line-height: 22px;
  710. height: 22px;
  711. margin-right: 5px;
  712. }
  713. }
  714. .gangwei{margin-top:0px;}
  715. .index_main{
  716. width: 92%;
  717. margin: 0 auto;
  718. }
  719. .index_1{ width: 100%; }
  720. .index_1{ margin-top:0px;}
  721. .demand_1{width:100%;float:none;}
  722. .demand_li_2{margin-bottom:4px;}
  723. .demand_li_2_label{font-size:14px;}
  724. .demand_li_2_text{font-size:14px;}
  725. .demand_ul_2{margin-top:12px;}
  726. .cruit_li_2_foot{margin-bottom:0px;margin-top:16px;}
  727. .demand_left_1{ padding-bottom:11px; }
  728. .demand_left_2{ padding-bottom:11px;margin-top:0px;}
  729. .demand_left_3{ padding-bottom:11px;margin-top:0px;}
  730. .demand_left_4{ padding-bottom:11px;margin-top:0px;}
  731. .demand_left_5{padding-bottom:11px;margin-top:0px;}
  732. .demand_left_6{ padding-bottom:11px;margin-top:0px;}
  733. .demand_left_7{ padding-bottom:11px;margin-top:0px;}
  734. .demand_left_8{ padding-bottom:11px;margin-top:0px;}
  735. .demand_head_name{margin-top:12px;font-size:16px;}
  736. .cruit_li_2_foot_tag{
  737. background-size: 16px 70%;
  738. padding-left:18px; font-size:12px;
  739. margin-right:13px;
  740. }
  741. .cruit_li_2_foot_tag:nth-last-of-type(1){margin-right:0px;}
  742. .demand_2{float:none;width:100%;}
  743. .phone_box_1 {
  744. .phone_box_1_head {
  745. height: 40px;
  746. line-height: 40px;
  747. background: #fff;
  748. border-bottom: 1px solid #E6E6E6;
  749. width: 100%;
  750. a {
  751. float: left;
  752. height: 40px;
  753. line-height: 40px;
  754. margin: 0;
  755. position: relative;
  756. color: #489d97;
  757. font-size: 16px;
  758. font-weight: bold;
  759. box-sizing: border-box;
  760. position: relative;
  761. padding-left: 8px;
  762. }
  763. a::before {
  764. content: '';
  765. display: block;
  766. position: absolute;
  767. left: 0px;
  768. top: 12px;
  769. background: linear-gradient(to top, #0998A9, #6ADDD6);
  770. width: 3px;
  771. height: 15px;
  772. }
  773. }
  774. }
  775. .phone_box_2 {
  776. margin: 0px auto 0px;
  777. .phone_box_1_head {
  778. height: 40px;
  779. line-height: 40px;
  780. background: #fff;
  781. border-bottom: 1px solid #E6E6E6;
  782. width: 100%;
  783. a {
  784. float: left;
  785. height: 40px;
  786. line-height: 40px;
  787. margin: 0;
  788. position: relative;
  789. color: #489d97;
  790. font-size: 16px;
  791. font-weight: bold;
  792. box-sizing: border-box;
  793. position: relative;
  794. padding-left: 8px;
  795. }
  796. a::before {
  797. content: '';
  798. display: block;
  799. position: absolute;
  800. left: 0px;
  801. top: 12px;
  802. background: linear-gradient(to top, #0998A9, #6ADDD6);
  803. width: 3px;
  804. height: 15px;
  805. }
  806. }
  807. }
  808. .phone_box_3 {
  809. margin: 0px auto 0px;
  810. .phone_box_1_head {
  811. height: 40px;
  812. line-height: 40px;
  813. background: #fff;
  814. border-bottom: 1px solid #E6E6E6;
  815. width: 100%;
  816. a {
  817. float: left;
  818. height: 40px;
  819. line-height: 40px;
  820. margin: 0;
  821. position: relative;
  822. color: #489d97;
  823. font-size: 16px;
  824. font-weight: bold;
  825. box-sizing: border-box;
  826. position: relative;
  827. padding-left: 8px;
  828. }
  829. a::before {
  830. content: '';
  831. display: block;
  832. position: absolute;
  833. left: 0px;
  834. top: 12px;
  835. background: linear-gradient(to top, #0998A9, #6ADDD6);
  836. width: 3px;
  837. height: 15px;
  838. }
  839. }
  840. }
  841. .phone_box_4 {
  842. margin: 0px auto 0px;
  843. .phone_box_1_head {
  844. height: 40px;
  845. line-height: 40px;
  846. background: #fff;
  847. border-bottom: 1px solid #E6E6E6;
  848. width: 100%;
  849. a {
  850. float: left;
  851. height: 40px;
  852. line-height: 40px;
  853. margin: 0;
  854. position: relative;
  855. color: #489d97;
  856. font-size: 16px;
  857. font-weight: bold;
  858. box-sizing: border-box;
  859. position: relative;
  860. padding-left: 8px;
  861. }
  862. a::before {
  863. content: '';
  864. display: block;
  865. position: absolute;
  866. left: 0px;
  867. top: 12px;
  868. background: linear-gradient(to top, #0998A9, #6ADDD6);
  869. width: 3px;
  870. height: 15px;
  871. }
  872. }
  873. }
  874. .phone_box_5 {
  875. margin: 0px auto 0px;
  876. .phone_box_1_head {
  877. height: 40px;
  878. line-height: 40px;
  879. background: #fff;
  880. border-bottom: 1px solid #E6E6E6;
  881. width: 100%;
  882. a {
  883. float: left;
  884. height: 40px;
  885. line-height: 40px;
  886. margin: 0;
  887. position: relative;
  888. color: #489d97;
  889. font-size: 16px;
  890. font-weight: bold;
  891. box-sizing: border-box;
  892. position: relative;
  893. padding-left: 8px;
  894. }
  895. a::before {
  896. content: '';
  897. display: block;
  898. position: absolute;
  899. left: 0px;
  900. top: 12px;
  901. background: linear-gradient(to top, #0998A9, #6ADDD6);
  902. width: 3px;
  903. height: 15px;
  904. }
  905. }
  906. }
  907. .phone_box_6 {
  908. margin: 0px auto 0px;
  909. .phone_box_1_head {
  910. height: 40px;
  911. line-height: 40px;
  912. background: #fff;
  913. border-bottom: 1px solid #E6E6E6;
  914. width: 100%;
  915. a {
  916. float: left;
  917. height: 40px;
  918. line-height: 40px;
  919. margin: 0;
  920. position: relative;
  921. color: #489d97;
  922. font-size: 16px;
  923. font-weight: bold;
  924. box-sizing: border-box;
  925. position: relative;
  926. padding-left: 8px;
  927. }
  928. a::before {
  929. content: '';
  930. display: block;
  931. position: absolute;
  932. left: 0px;
  933. top: 12px;
  934. background: linear-gradient(to top, #0998A9, #6ADDD6);
  935. width: 3px;
  936. height: 15px;
  937. }
  938. }
  939. }
  940. .phone_box_7 {
  941. margin: 0px auto 0px;
  942. .phone_box_1_head {
  943. height: 40px;
  944. line-height: 40px;
  945. background: #fff;
  946. border-bottom: 1px solid #E6E6E6;
  947. width: 100%;
  948. a {
  949. float: left;
  950. height: 40px;
  951. line-height: 40px;
  952. margin: 0;
  953. position: relative;
  954. color: #489d97;
  955. font-size: 16px;
  956. font-weight: bold;
  957. box-sizing: border-box;
  958. position: relative;
  959. padding-left: 8px;
  960. }
  961. a::before {
  962. content: '';
  963. display: block;
  964. position: absolute;
  965. left: 0px;
  966. top: 12px;
  967. background: linear-gradient(to top, #0998A9, #6ADDD6);
  968. width: 3px;
  969. height: 15px;
  970. }
  971. }
  972. }
  973. .phone_box_8 {
  974. margin: 0px auto 0px;
  975. .phone_box_1_head {
  976. height: 40px;
  977. line-height: 40px;
  978. background: #fff;
  979. border-bottom: 1px solid #E6E6E6;
  980. width: 100%;
  981. a {
  982. float: left;
  983. height: 40px;
  984. line-height: 40px;
  985. margin: 0;
  986. position: relative;
  987. color: #489d97;
  988. font-size: 16px;
  989. font-weight: bold;
  990. box-sizing: border-box;
  991. position: relative;
  992. padding-left: 8px;
  993. }
  994. a::before {
  995. content: '';
  996. display: block;
  997. position: absolute;
  998. left: 0px;
  999. top: 12px;
  1000. background: linear-gradient(to top, #0998A9, #6ADDD6);
  1001. width: 3px;
  1002. height: 15px;
  1003. }
  1004. }
  1005. }
  1006. .demand_ul_1{margin-top:12px;}
  1007. .phone_li_line{height:1px;background:#E6E6E6;margin:11px auto;}
  1008. .phone_ul_a{height:21px;line-height:21px;margin-bottom:4px;
  1009. color:#333;font-size:14px;}
  1010. .demand_ul_1_span{margin-bottom:4px;font-size:14px;}
  1011. .demand_article_1{
  1012. margin-top: 12px!important
  1013. }
  1014. .demand_article_1,.demand_article_1 *{
  1015. font-size: 14px!important;
  1016. line-height: 26px!important;
  1017. }
  1018. .demand_article_2{
  1019. margin-top: 12px!important
  1020. }
  1021. .demand_article_2 *,.demand_article_1 *{
  1022. font-size: 14px!important;
  1023. line-height: 26px!important;
  1024. }
  1025. .phone_head_btn_box{background:#fff;position:fixed;left:0px;bottom:0px;
  1026. text-align:center;
  1027. height:55px;width:100%; z-index:1122;
  1028. }
  1029. .phone_head_btn{
  1030. text-align:center;color:#fff;line-height:33px;
  1031. height:33px;display:inline-block; font-size:16px;border-radius:6px;
  1032. margin-top:11px;
  1033. background: url(@/public/image/05.png) no-repeat 8px center;
  1034. background-size: 18px 18px;
  1035. padding: 0px 15px 0px 35px;
  1036. }
  1037. .phone_head_btn_gray{
  1038. background-color:#ccc;
  1039. }
  1040. .phone_head_btn_green{
  1041. background-color:#489d97;
  1042. }
  1043. .phone_foot{height:55px; }
  1044. .phone_none{display:none;}
  1045. }
  1046. </style>